<template>
  <view class="login-container">
    <!-- 顶部logo -->
    <view class="logo">
      <image src="https://bigironcollision.obs.cn-east-3.myhuaweicloud.com:443/temp%2Ftx_1757241357597.png" mode="aspectFit"></image>
    </view>
    
    <!-- 登录表单 -->
    <view class="login-form">
      <view class="form-item">
        <text class="label">账号</text>
        <input 
          class="input" 
          type="text" 
          v-model="username" 
          placeholder="请输入手机号/用户名" 
          placeholder-class="placeholder"
        />
      </view>
      
      <view class="form-item">
        <text class="label">密码</text>
        <input 
          class="input"  password
          v-model="password" 
          placeholder="请输入密码" 
          placeholder-class="placeholder"
          @confirm="handleLogin"
        />
      </view>
      
      <!-- <view class="forget-pwd" @click="navigateToForget">
        忘记密码?
      </view> -->
      
      <button 
        class="login-btn" 
        :disabled="!canLogin" 
        @click="handleLogin"
      >
        登录
      </button>
      
      <!-- <view class="register-tip">
        还没有账号? <text class="register" @click="navigateToRegister">立即注册</text>
      </view> -->
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      username: '', // 账号
      password: ''  // 密码
    }
  },
  computed: {
    // 是否可以登录（简单的表单验证）
    canLogin() {
      return this.username.length > 0 && this.password.length >= 0
    }
  },
  methods: {
    // 处理登录
    handleLogin() {
      if (!this.canLogin) {
        uni.showToast({
          title: '请输入正确的账号和密码',
          icon: 'none'
        })
        return
      }
	  uni.showLoading({
	    title: '登录中...',
	    mask: true
	  })
      this.$http('jeecg-boot/sys/mdLogin',{
      	"username":this.username,"password":this.password
      },'POST').then(res => {
      		   //console.log(res)
      	 uni.hideLoading();
      	 if(res.success){
			 uni.showToast({
			     title: '登录成功',
			 	 icon:'none',
			     duration: 3000,
			 });
			 var userInfo=res.result.userInfo
			 var token=res.result.token
			 uni.setStorageSync('userInfo', 
			    userInfo
			  )
			uni.setStorageSync('token',token )
			 // 登录成功后跳转到首页
			  uni.switchTab({
			    url: '/pages/index/index'
			  }) 
		 }else{
			 uni.showToast({
			     title: res.message,
			 	 icon:'none',
			     duration: 3000,
			 });
		 }
       }).catch(err=>{
		   uni.hideLoading();
	   })
      // 显示加载中
     
      
      // 模拟登录请求
     
        
      
        
        // 存储用户信息
       /* uni.setStorageSync('userInfo', {
          username: this.username
        }) */
     
    },
    
    // 实际项目中的登录请求方法
    loginRequest() {
      uni.request({
        url: 'https://your-api.com/login',
        method: 'POST',
        data: {
          username: this.username,
          password: this.password
        },
        success: (res) => {
          if (res.data.code === 200) {
            // 登录成功处理
          } else {
            uni.showToast({
              title: res.data.message || '登录失败',
              icon: 'none'
            })
          }
        },
        fail: (err) => {
          uni.showToast({
            title: '网络错误',
            icon: 'none'
          })
        }
      })
    },
    
    // 跳转到忘记密码页面
    navigateToForget() {
      uni.navigateTo({
        url: '/pages/forget/forget'
      })
    },
    
    // 跳转到注册页面
    navigateToRegister() {
      uni.navigateTo({
        url: '/pages/register/register'
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.login-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 60rpx 80rpx;
  box-sizing: border-box;
  height: 100vh;
  background-color: #f8f8f8;
}

.logo {
  width: 200rpx;
  height: 200rpx;
  margin-bottom: 80rpx;
  
  image {
    width: 100%;
    height: 100%;
  }
}

.login-form {
  width: 100%;
}

.form-item {
  margin-bottom: 40rpx;
  
  .label {
    display: block;
    font-size: 28rpx;
    color: #333;
    margin-bottom: 20rpx;
    font-weight: bold;
  }
  
  .input {
  /*  width: 100%; */
    height: 90rpx;
    padding: 0 30rpx;
    background-color: #fff;
    border-radius: 45rpx;
    font-size: 30rpx;
    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
  }
  
  .placeholder {
    color: #ccc;
    font-size: 28rpx;
  }
}

.forget-pwd {
  text-align: right;
  font-size: 26rpx;
  color: #999;
  margin-bottom: 60rpx;
}

.login-btn {
  width: 100%;
  height: 90rpx;
  line-height: 90rpx;
  text-align: center;
  background-color: #007AFF; /* 蓝色按钮 */
  color: #fff;
  border-radius: 45rpx;
  font-size: 32rpx;
  margin-bottom: 40rpx;
  border: none;
  
  &[disabled] {
    background-color: #a0cfff;
    opacity: 0.7;
  }
  
  &::after {
    border: none;
  }
}

.register-tip {
  text-align: center;
  font-size: 28rpx;
  color: #666;
  
  .register {
    color: #007AFF;
  }
}
</style>